<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        function delay(s) {
            return new Promise((resolve, reject) => {
                setTimeout(() => {
                    resolve(`延迟了${s}秒`)
                })
            })
        }
        async function fun1() {
            const res1 = await delay(1)
            console.log('res1', res1)
            const res2 = await delay(3)
            console.log('res2', res2)
        }
        async function fun2() {
            const res3 = await delay(2)
            console.log('res3', res3)
            const res4 = await delay(4)
            console.log('res4', res4)
        }
        //   fun1()
        //   fun2()
        // res1 res3 res2 res4
        // await函数只能影响async函数内部的执行顺序，并不能影响外部函数的执行顺序
        //   验证async函数的返回值是什么:promise
        //   let p = fun1()
        //   console.log('p', p) // promise

        // 想要先执行完fun1里面的所有代码，再去执行func2里面的代码，又该怎么做？
        async function yyy() {
            await fun1()
            await fun2()
        }
        yyy() // res1 res2 res3 res4

        // 以上代码等价于：
        fun1().then((res) => {
            fun2()
        })

        // 再次证明：
        //await函数只能影响async函数内部的执行顺序，并不能影响外部函数的执行顺序
        console.log('top111')
        yyy()
        console.log('bottom111')
        // top111 bottom111 res1 res2 res3 res4
    </script>
</body>

</html>